import * as echarts from '../../ec-canvas/echarts.js';
import api from '../../request/api.js';

let chart = null;

function initChart(canvas, width, height, dpr) {
  chart = echarts.init(canvas, null, {
    width: width,
    height: height,
    devicePixelRatio: dpr // new
  });
  canvas.setChart(chart);

var option = {
  color: ['#37a2da', '#32c5e9', '#67e0e3'],
  tooltip: {
    trigger: 'axis',
    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
      type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
    },
    confine: true
  },
  legend: {
    data: ['热度', '负面']
  },
  grid: {
    left: 20,
    right: 20,
    bottom: 15,
    top: 40,
    containLabel: true
  },
  yAxis: [
    {
      type: 'value',
      axisLine: {
        lineStyle: {
          color: '#fff'
        }
      },
      axisLabel: {
        color: '#666'
      },
      splitLine: {    // gird 区域中的分割线
        show: true,   // 是否显示
        lineStyle: {
          color: '#666666',
          width: 1,
          type: 'dashed' //分割线是实线还是虚线
        }
      },
    }
  ],
  xAxis:[ {
  
    type: 'category',
    axisTick: { show: false },
    data: ['总计', '本月', '本周'],
    axisLine: {
      lineStyle: {
        color: '#666666'
      }
    },
    axisLabel: {
      margin:10,
      color: '#666666'
    }
  },
  ],
  series: [
    {
      name: '总计',
      type: 'bar',
      label: {
        normal: {
          show: true
        }
      },
      data: [],
      itemStyle: {
        normal: {
          label: {
            show: true,
            // position: 'right',
            // formatter: '{c}%'
          },
          color: function (params) {
            // build a color map as your need.            
            var colorList = [
              '#1CC4AD', '#1C79C4', '#5B8FF9', '#5B8FF9', '#27727B',
              '#FE8463', '#9BCA63', '#FAD860', '#F3A43B', '#60C0DD',
              '#D7504B', '#C6E579', '#F4E001', '#F0805A', '#26C0C0'
            ];
            return colorList[params.dataIndex]
          }
        }
      },
      barWidth: 32,  // 柱形的宽度
    }
  ]
}
  api('Get','Recycle/staff/getDataStatistics',{
    staff_id: wx.getStorageSync('userInfo').user_id
  }).then(res => {
  console.log(res);
    let arrs = []
    let dataX = res.data.data
    Object.keys(dataX).forEach(function (key) {
      arrs.push(dataX[key])
    });
    option.series[0].data = arrs
    console.log(option.series[0].data);
    chart.setOption(option);  
}) 
  return chart;
}

Page({
  onShareAppMessage: function (res) {
    return {
      title: 'ECharts 可以在微信小程序中使用啦！',
      path: '/pages/index/index',
      success: function () { },
      fail: function () { }
    }
  },
  data: {
    ec: {
      onInit: initChart
    }
  },

  onReady() {
   
  }
});
